<template>
	<h2>生命周期----函数</h2>
	<button @click="count++">{{count}}</button>
</template>

<script>
	import{
	onBeforeMount,onMounted,onBeforeUpdate,onUpdated,ref,onBeforeUnmount,onUnmounted
	} from 'vue'
	export default{
		beforeCreate(){//
			console.log("beforeCreate")
		},
		created(){//创建完成
			console.log("created")
		},
		beforeMount(){
			console.log("beforeMount")
		},
		setup(){
			const count = ref(0)
			console.log("setup")
			onBeforeMount(()=>{//组件挂载到节点之前执行
				console.log("onBeforeMout")
			})
			onMounted(()=>{//组件挂载完成
				console.log("onMounted")
			})
			onBeforeUpdate(()=>{//组件更新前执行
				console.log("onBeforeUpdate")
			})
			onBeforeUnmount(()=>{//组件更新完成后执行
				console.log("onUpdated")
			})
			onUpdated(()=>{//组件卸载之前执行
				console.log("onBeforeUnmount")
			})
			onUnmounted(()=>{//组件卸载完成后执行
				console.log("onUnmounted")
			})
			
		
			
			return{
				count
			}
		}
		
	}
</script>

<style>
</style>
